<template>
  <v-app id="inspire">
    <v-main>
      <v-container
        class="fill-height d-flex flex-row justify-center align-center"
        fluid
      >
        <img
          style="height: 100px; margin-bottom: 30px; margin-top: auto"
          src="../assets/logo.png"
        />
        <v-row
          style="margin-top: 20px; margin-bottom: auto"
          flex="column"
          align="center"
          justify="center"
        >
          <v-col cols="12" sm="8" md="4">
            <v-card class="elevation-12">
              <v-toolbar color="primary" dark flat>
                <v-toolbar-title>飞燕齿科后台管理系统</v-toolbar-title>
              </v-toolbar>
              <v-card-text>
                <v-form>
                  <v-text-field
                    label="用户名"
                    name="login"
                    v-model="username"
                    prepend-icon="mdi-account"
                    type="text"
                  ></v-text-field>

                  <v-text-field
                    id="password"
                    label="密码"
                    name="password"
                    v-model="password"
                    prepend-icon="mdi-lock"
                    type="password"
                  ></v-text-field>
                </v-form>
              </v-card-text>
              <v-card-actions>
                <v-spacer></v-spacer>
                <v-btn color="primary" @click="login">登录</v-btn>
              </v-card-actions>
            </v-card>
          </v-col>
        </v-row>
      </v-container>
    </v-main>
  </v-app>
</template>

<script>
export default {
  props: {
    source: String,
  },
  name: "Index",
  components: {},

  data: () => {
    return {
      username: null,
      password: null,
    };
  },

  computed: {},

  created() {
    this.Http.get("/admin/home/option").then((res) => {
      if (res.code == 1) {
        sessionStorage.setItem("option", JSON.stringify(res.data));
      } else {
        this.$Message.error("配置信息获取失败");
      }
    });
  },

  methods: {
    login() {
      if (!this.username || !this.password) {
        this.$Message.error("请将信息填写完整");
        return;
      }
      this.Http.post("/admin/home/login", {
        username: this.username,
        password: this.password,
      }).then((res) => {
        if (res.code == 1) {
          // 保存Token
          this.Util.setToken(res.data.token);
          // 保存登陆信息
          sessionStorage.setItem("LOGIN_INFO", JSON.stringify(res.data));
          // 跳转路由
          this.$router.push({ path: "/Home" });
        } else {
          this.$Message.error(res.msg);
        }
      });
    },
  },
};
</script>